<!--
 * @Author: 无聊 7989314+Hwz1997@user.noreply.gitee.com
 * @Date: 2025-07-08 08:35:19
 * @LastEditors: 无聊 7989314+Hwz1997@user.noreply.gitee.com
 * @LastEditTime: 2025-09-26 15:32:20
 * @FilePath: \keep_motion_manger\src\components\importDialog\index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
    <el-dialog width="500px" :model-value="visible" destroy-on-close :before-close="beforeClose">
        <ul class="infinite-list" style="overflow: auto">
            <li v-for="item in list" :key="item._id" class="infinite-list-item">
                <el-avatar :src="`${baseUrl}${item[config.image]}`" :size="50" />
                <span class="show-more-name">{{ item[config.title] }}</span>
            </li>
        </ul>
        <template #footer>
            <span class="dialog-footer">
                <el-button type="primary" @click="beforeClose">关闭</el-button>
            </span>
        </template>
    </el-dialog>
</template>

<script setup>

import { ref, reactive, onMounted, defineProps, defineEmits} from 'vue';

const baseUrl = import.meta.env.VITE_BASE_URL;
import { dictDataApi } from '@/api';
import './index.css';

const props = defineProps({
    visible: {
        type: Boolean,
        default: () => false
    },
    list: {
        type: Array,
        default: () => []
    },
    config: {
        type: Object,
        default: () => ({
            image: 'avatar',
            title: 'name',
        })
    }
});

const emit = defineEmits(['close', 'successCallBack']);
// 关闭前
const beforeClose = (done) => {
    emit('close');
};
</script>